<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>">
<!-- 加载引用文件 -->
<%@ include file="../common/verify.jsp"%>
<jsp:include page="../common/meta.jsp"></jsp:include>
<jsp:include page="../common/easyui.jsp"></jsp:include>
<script type="text/javascript">
	var userDataGrid;
	var editUserWindow;
	var editUserForm;
	var userRowIndex;
	var roleCombobox;
	var stateCombobox;

	$(function() {
		userDataGrid = $('#userDataGrid').datagrid({
			url : 'json/user_list',
			title : '网址列表',
			iconCls : 'icon-save',
			pagination : true,
			pageSize : 10,
			pageList : [ 10, 20, 30 ],
			fit : true,
			fitColumns : true,
			nowrap : false,
			border : true,
			idField : 'id',
			columns : [ [ {
				title : '用户编码',
				field : 'id',
				width : 30
			}, {
				title : '用户名',
				field : 'userName',
				sortable : true,
				width : 50
			}, {
				title : '登录密码',
				field : 'password',
				sortable : true,
				width : 30,
				formatter : function(value, row, index) {
					return "******";
				}
			}, {
				title : '出生日期',
				field : 'birthdate',
				sortable : true,
				width : 50,
				formatter : function(value, row, index) {
					return value.substring(0,10);
				}
			}, {
				title : '角色',
				field : 'roleId',
				width : 30
			}, {
				title : '状态',
				field : 'state',
				width : 20
			} ] ],
			toolbar : [ {
				text : '增加',
				iconCls : 'icon-add',
				handler : newUser
			}, '-', {
				text : '删除',
				iconCls : 'icon-remove',
				handler : deleteUser
			}, '-', {
				text : '修改',
				iconCls : 'icon-edit',
				handler : editUser
			}, '-', {
				text : '取消选中',
				iconCls : 'icon-undo',
				handler : function() {
					userDataGrid.datagrid('unselectAll');
				}
			} ],
			onSelect : function(rowIndex, rowData) {
				console.info('当前选择的行：' + rowIndex);
				userRowIndex = rowIndex;
			},
			loadMsg : '加载中，请稍候...'
		});

		editUserWindow = $('#editUserWindow').window({
			closed : true,
			modal : true,
			collapsible : false,
			minimizable : false,
			maximizable : false,
			resizable : true
		});

		editUserForm = editUserWindow.find('form');

		$('#btnSaveUser').linkbutton();
		$('#btnCloseUserWindow').linkbutton();

		// 加载角色列表选项
		roleCombobox = $('#roleId').combobox({
			data : [ {
				"roleId" : 0,
				"roleName" : "普通用户"
			}, {
				"roleId" : 90,
				"roleName" : "管理员"
			}, {
				"roleId" : 99,
				"roleName" : "系统管理员"
			} ],
			valueField : 'roleId',
			textField : 'roleName'
		});

		// 加载用户状态选项
		stateCombobox = $('#state').combobox({
			data : [ {
				"id" : 0,
				"text" : "停用"
			}, {
				"id" : 1,
				"text" : "正常"
			} ],
			valueField : 'id',
			textField : 'text'
		});

		$('#password').validatebox({
			required : true
		});

	});

	function newUser() {
		console.info('增加...');
		editUserWindow.window('open');
		editUserWindow.find('#id').attr('readonly', true);
		editUserWindow.find('#userName').attr('readonly', false);
		
		editUserForm.form('clear');
		editUserWindow.find('#id').val(0);
		editUserWindow.find('#userName').val("");
		editUserWindow.find('#password').val("");
		editUserWindow.find('#birthdate').val("");
		editUserWindow.find('#roleId').combobox('setValue', 0);
		editUserWindow.find('#state').combobox('setValue', 0);
		
		editUserForm.url = 'json/user_add';
		
		editUserWindow.find('#userName').focus();
	}

	function editUser() {
		console.info('修改...');
		// 选择最后选中的行
		userDataGrid.datagrid('clearSelections');
		userDataGrid.datagrid('selectRow', userRowIndex);
		var row = userDataGrid.datagrid('getSelected');
		if (row) {
			editUserWindow.window('open');
			editUserWindow.find('#id').attr('readonly', true);
			editUserWindow.find('#userName').attr('readonly', true);
			editUserWindow.find('#id').val(row.id);
			editUserWindow.find('#userName').val(row.userName);
			editUserWindow.find('#password').val("");
			editUserWindow.find('#birthdate').val((row.birthdate).substring(0,10));
			
			console.info('row.id:' + row.id);
			if (row.roleId != null) {
				roleCombobox.combobox('setValue', row.roleId);
			}
			if (row.state != null) {
				editUserWindow.find('#state').combobox('setValue', row.state);
			}

			editUserForm.url = 'json/user_update';
		} else {
			$.messager.alert('提示', '请选择要修改的记录！', 'error');
		}
	}

	function deleteUser() {
		console.info('删除...');
		var userName = [];
		var rows = userDataGrid.datagrid('getSelections');
		if (rows.length > 0) {
			$.messager.confirm('请确认', '您要删除当前所选项目？', function(r) {
				if (r) {
					for ( var i = 0; i < rows.length; i++) {
						console.info(rows[i].id);
						userName.push(rows[i].id);
					}
					$.ajax({
						url : 'json/user_delete',
						data : {
							id : userName.join(',')
						},
						cache : false,
						dataType : "json",
						success : function(response) {
							userDataGrid.datagrid('unselectAll');
							userDataGrid.datagrid('reload');
							$.messager.show({
								title : '提示',
								msg : '删除成功！'
							});
						}
					});
				}
			});
		} else {
			$.messager.alert('提示', '请选择要删除的记录！', 'error');
		}
	}

	// 保存新增分类
	function saveUser() {
		console.info('保存...');
		if (editUserForm.url == '') {
			editUserForm.url = 'json/user_add';
		}

		editUserForm.form('submit', {
			url : editUserForm.url,
			success : function(data) {
				console.info(data);
				editUserWindow.window('close');
				userDataGrid.datagrid('reload');
				$.messager.show({
					title : '提示',
					msg : '增加成功！'
				});
			},
			error : function(json) {
				console.info('保存出错！');
				$.messager.alert('提示', '保存失败！', 'error');
			}
		});
	}

	function closeUserWindow() {
		editUserWindow.window('close');
	}
</script>
<title>用户列表</title>
</head>
<body style="width: 720px; height: 520px; margin: 0 auto;">
	<div title="用户列表" border="false" closable="true"
		style="width: 100%; height: 100%;">
		<table id="userDataGrid"></table>
	</div>

	<div id="editUserWindow" class="easyui-window" title="用户列表"
		style="width: 450px; height: 320px;">
		<div style="padding: 20px 20px 40px 80px;">
			<form method="post">
				<table>
					<tr>
						<td>用户编码：</td>
						<td><input id="id" name="user.id"></input>
						</td>
					</tr>
					<tr>
						<td>用户名：</td>
						<td><input id="userName" name="user.userName"></input>
						</td>
					</tr>
					<tr>
						<td>密码：</td>
						<td><input type="password" id="password" name="user.password"
							class="easyui-validatebox"></input>
						</td>
					</tr>
					<tr>
						<td>出生日期：</td>
						<td><input id="birthdate" name="user.birthdate" type="text"
							class="easyui-datebox" required="required"></input>
						</td>
					</tr>
					<tr>
						<td>角色：</td>
						<td><input id="roleId" name="user.roleId" value="0"></input>
						</td>
					</tr>
					<tr>
						<td>状态：</td>
						<td><input id="state" name="user.state" value="0"></input>
						</td>
					</tr>
					<tr>
						<td></td>
						<td id="saveUserMsg" style="color: red; font: 12px">&nbsp;</td>
					</tr>
				</table>
			</form>
		</div>
		<div style="text-align: center; padding: 5px;">
			<a href="javascript:void(0)" onclick="saveUser()" id="btnSaveUser"
				icon="icon-save">保存</a> <a href="javascript:void(0)"
				onclick="closeUserWindow()" id="btnCloseUserWindow"
				icon="icon-cancel">取消</a>
		</div>
	</div>
</body>
</html>